<template>
  <!-- 录入新单 -->
  <div class="box">
    <section class="section_one">
      <FunctionalAreas></FunctionalAreas>
      <div class="title_sub prduct_bod_r">产品说明：</div>
      <ProductDescription></ProductDescription>
    </section>
    <section class="section_two">
      <div class="title_sub infro_bod_l">信息录入：</div>
      <Information ref="Information"></Information>
    </section>
    <section class="section_three">
      <div class="title_sub upload_bod_l">附件管理：</div>
      <!-- 上传组件 -->
      <Upload class="uploadStyle" ref="Uploade" :isNew="isNew"></Upload>
    </section>
    <el-button class="tijiao" type="primary" @click="submit">提交</el-button>
  </div>
</template>

<script>
//import { saveOrder } from "../../../src/assets/js/api";
import "@/assets/js/validation";
import FunctionalAreas from "../../components/meitList/FunctionalAreas"; //乐业保-》录入新单-》功能区！
import ProductDescription from "../../components/meitList/ProductDescription"; //乐业保-》录入新单-》产品说明！
import Upload from "../../components/meitList/Upload"; //乐业保-》录入新单-》附件管理！
import Information from "../../components/meitList/Information"; //乐业保-》录入新单-》！
import { getOrderOne } from "../../assets/js/api";
// import { checkPhone } from "../../../src/assets/js/utlis";
export default {
  name: "NewSingleEntry",
  components: {
    FunctionalAreas,
    Information,
    ProductDescription,
    Upload,
  },
  created() {
    //产品ID
    this.prductId = parseInt(sessionStorage.getItem("prductId"));
    this.ProductUrl = this.$route.query.path;
    this.getOrderOne(this.prductId);
  },

  data() {
    return {
      isNew: true,
      productId: null,
      registerUrl: "/business/order/save",
      ProductUrl: "",
      template: "",
    };
  },
  methods: {
    //确定提交按钮
    submit() {
      let thisObj = this;
      let bStop = true;
      let orderNumber = this.$refs.Uploade.orderNumber;
      let formData = this.$refs.Information.form;
      let prductId = parseInt(sessionStorage.getItem("prductId"));
      //带上订单号跟产品ID
      formData.productId = prductId;
      formData.orderNumber = orderNumber;
      bStop = this.checkForm();
      if (bStop) {
        let that = this;
        this.axios
          .post(this.registerUrl, formData, {
            headers: {
              "Content-Type": "application/json;charset=UTF-8",
            },
          })
          .then(function (res) {
            if (res.data.code == 200) {
              that.$message({
                message: res.data.message,
                type: "success",
              });
              thisObj.$router.replace({
                path: "/Index/HasBeenRecorded",
                query: { orderNumber: orderNumber, path: thisObj.ProductUrl },
              });
            }
          })
          .catch(function (error) {
            that.$message({
              message: error.message,
              type: "error",
            });
          });
        Information.orderNumber = orderNumber;
      }
    },
    //验证格式
    checkForm() {
      //子组件的表格
      this.$refs.Information.validateForm();
      this.$nextTick(() => {
        let isValid = this.$refs.Information.isValid;
        if (!isValid) {
          this.$message({
            message: "请完成基础信息的非空填写",
            type: "error",
          });
          return false;
        }
      });

      //上传的图片
      let accList = this.$refs.Uploade.accList;
      var idStatus = false;
      if (
        accList.type1face.data.length > 0 &&
        accList.type1back.data.length > 0
      ) {
        idStatus = true;
      }

      if (!idStatus) {
        this.$message({
          message: "请上传证件照",
          type: "error",
        });
        return false;
      }
      return true;
    },
    getOrderOne(id) {
      getOrderOne(id).then((res) => {
        this.template = res.data.pcCode;
      });
    },
  },
};
</script>

<style scoped type="less">
.text
{
    font-size: 20px;  font-weight: bold;  margin-top: 20px;  text-align: left;  text-indent: 2em;
}

.uploadStyle
{
    position: relative;  margin-top: 20px;
}
.tijiao
{ width: 120px;  height: 40px;
    margin-right: 20px;  margin-bottom: 40px; 
}

</style>
